<!DOCTYPE html>
<html lang="en">
<head>
    <title>lesson3</title>
    <meta charset="utf-8">
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=0">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <script src="lib/vue.js"></script>
</head>
<body>
<style>
    .single-choice {
        display: inline-block;
        margin-top: 10px;
    }
</style>
<form id="demo">
    <div v-repeat="item in listItem">
        <span>{{item.attributeName}}:</span>
        <div v-repeat="op in item.attributeValueList" class="single-choice">
            <input type="{{item.type}}" name='{{item.type}}' id="{{op.valueId}}" checked ="{{op.check}}" v-on="change:onChange"/>
            <label name={{item.attributeName}}>
                {{op.valueName}}
            </label>
        </div>
        <div class="single-choice">
            <input type="{{item.type}}" name='{{item.type}}'/>
            <input type="text" id="{{item.attributeId}}"  v-on="blur: onBlur"/>
        </div>
    </div>
</form>
<style>
    body {
        font-family: Helvetica Neue, Arial, sans-serif;
    }

    li.done {
        text-decoration: line-through;
    }
</style>
<script src="text9.js"></script>
</body>
</html>